body, div, hr, input, ul, li { margin: 0 0; padding: 0 0; }
body { font-family: 'Helvetica Neue', Helvetica, 'Hiragino Sans GB', 'Segoe UI', 'Microsoft Yahei', Tahoma, Arial, STHeiti, sans-serif; }
hr { border: none; border-top: 1px solid #e1e1e1; }
input, textarea { outline: none; padding: 4px; border: 1px solid #e1e1e1; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
input:focus, textarea:focus { border: 1px solid #2480E1; }
ul { list-style: none; }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-button { }
::-webkit-scrollbar-track { }
::-webkit-scrollbar-track-piece { }
::-webkit-scrollbar-thumb { width: 8px; background-color: #e1e1e1; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
::-webkit-scrollbar-corner { }
::-webkit-resizer { }
.bg { background-color: #f9f9f7; }
.bg_fbfbfb { background-color: #fbfbfb; }
.c_51 { color: #515151; }
.c_999 { color: #999; }
.c_ccc { color: #ccc; }
.orange { color: #f7af49; }
.red { color: #f47a55; }
.green { color: #88b244; }
.m { margin-left: auto; margin-right: auto; }
.mt5 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mt15 { margin-top: 15px; }
.mt20 { margin-top: 20px; }
.mt25 { margin-top: 25px; }
.mt30 { margin-top: 30px; }
.mb5 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb25 { margin-bottom: 25px; }
.mb30 { margin-bottom: 30px; }
.ml5 { margin-left: 5px; }
.ml10 { margin-left: 10px; }
.mr5 { margin-right: 5px; }
.mr10 { margin-right: 10px; }
.w { width: 100%; }
.w600 { width: 600px; }
.w800 { width: 800px; }
.h0 { height: 0; }
.h30 { height: 30px; }
.tc { text-align: center; }
.tl { text-align: left; }
.tr { text-align: right; }
.fl { float: left; }
.fr { float: right; }
.clearfix { clear: both; }
.oh { overflow: hidden; }
.f12 { font-size: 12px; }
.f14 { font-size: 14px; }
.f16 { font-size: 16px; }
.f18 { font-size: 18px; }
.f20 { font-size: 20px; }
.f22 { font-size: 22px; }
.block { display: block; }
.pr { position: relative; }
.pa { position: absolute; }
.pf { position: fixed; }
.none { display: none; }
.pane {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: solid 1px #e1e1e1;
    box-shadow: 0 1px 3px #eee, inset 0 0 3px #fff;
    padding: 20px 10px;
}
.msgItem {
    background: #f7f7f4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #e1e1e1;
    padding: 6px 8px;
    width: 80%;
    margin: 6px 8px;
}
.msgItem .header {
    font-weight: bold;
}
.msgItem .content {
}
.msgItem .footer {
    text-align: right;
    font-size: 0.8em;
    color: #999;
}
.infoItem {
    background: #f7f7f4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #f7af49;
    padding: 6px 8px;
    margin: 6px 8px;
    text-align: center;
    clear: both;
}
.btn {
    display: block;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background-color: #ccc;
    border: 1px solid #aaa;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    padding: 8px 20px;
    font-weight: 400;
    /*overflow: hidden;*/
    line-height: 1.2em;
}
.btn:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.btn:active {
    background-color: #bbb;
}
.btn-success {
    color: #fff;
    background-color: #5cb85c;
    border: 1px solid #3e8f3e;
}
.btn-success:active {
    background-color: #47a447;
}
.btn-error {
    color: #fff;
    background-color: #f47a55;
    border: 1px solid #e86a45;
}
.btn-error:active {
    background-color: #ec6d48;
}
.btn-basic {
    background-color: #fff;
}
.btn-basic:active {
    background-color: #fff;
    border: solid 1px #2480E1;
    color: #2480E1;
}
.btn-left {
    text-align: left;
    float: left;
}
.btn-right {
    text-align: right;
    float: right;
}
.itemPane {
    padding: 0 0;
}
.itemPane .header {
    padding: 10px 12px;
    border-bottom: solid 1px #e1e1e1;
    background-color: #f7f7f4;
}
.itemPane .item {
    display: block;
    padding: 10px 12px;
    cursor: pointer;
    border-bottom: solid 1px #e1e1e1;
    border-top: solid 1px #fff;
    background-color: #fff;
}
.itemPane .item:active {
    background-color: #f7f7f4;
}
.highlight {
    color: #2480E1;
}
.faceWrapper {
    /*-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;*/
    position: absolute;
    width: 356px;
    height: 180px;
    background-color: white;
    border: 1px solid #999;
    left: 0;
    top: -195px;
    padding-left: 5px;
    padding-top: 5px;
    overflow-y: scroll;
}
.faceWrapper .item {
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
    border: 1px solid #ccc;
    width: 30px;
    height: 30px;
    margin-right: 5px;
    margin-bottom: 5px;
    overflow: hidden;
    float: left;
    cursor: pointer;
}
.faceWrapper .item:hover { border: 1px solid #2480E1; }
.faceWrapper .item img { width: 100%; height: auto; }
.msgItem .face { vertical-align: middle; }
.msgItem .face.emoji { width: 30px; height: auto; margin: -6px -2px -4px; }
.msgItem .face.tuzji { width: auto; height: 50px; }
.msgItem .img { border: 1px solid #ccc; max-width: 100%; height: auto; }